import Skeleton from '@/library/gallery/components/Skeleton'
import { DemoBlock } from '@/library/widgets/DemoBlock'

export default function DemoSkeleton(): React.ReactNode {
  return (
    <>
      <DemoBlock title="基础用法">
        <Skeleton.Title />
        <Skeleton.Paragraph />
      </DemoBlock>
      <DemoBlock title="有动画的骨架屏">
        <Skeleton.Title animated />
        <Skeleton.Paragraph lineCount={5} animated />
      </DemoBlock>
      <DemoBlock title="自定义">
        <Skeleton
          animated
          style={{
            '--width': '70%',
            '--height': '100px',
            '--border-radius': '8px',
          }}
        />
      </DemoBlock>
    </>
  )
}
